<style>
	.text-muted { font-size: 10px; color: #777777; }
	h2{ color: #666; }
	.text-muted {
		height: 25px;
		line-height: 25px;
	}
</style>
<div style="background-color: #f5f5f5; margin-top: -15px;">
	<div class="container padding-none">
		<!-- 面包屑路径导航 -->
		<ol class="breadcrumb hidden-xs" style="margin-bottom:0px;">
			<li><a href="{:addon_url('leescore/index/index')}">{:__('store title')}</a></li>
			<li><a href="{:addon_url('leescore/goods/index')}">{:__('goods list')}</a></li>
			<li class="active">{:__('goods detail')} - {$item.name}</li>
		</ol>
		<!-- 面包屑路径导航 -->	
	</div>
</div>

<div class="container padding-small page-content">
	<div class="row">
    	<div class="col-md-3 hidden-xs padding-none">
			<div class="goods-left">
				<div class="box box-default radius-none" style="border-top: 3px solid #eee">
					<div class="box-header with-border">
						<h3 class="box-title">{:__('convert')}</h3>
					<!-- /.box-tools -->
					</div>
					<!-- /.box-header -->
					<div>
						{volist name="usenumdesc" id="vo"}
							<div class="padding-top padding-bottom goods-detail-li {if($i % 2 == 0)}goods-double{/if}">
								<div class="col-xs-4">
									<a href="{:addon_url('leescore/goods/details',array('gid' => $vo['id']))}"><img class="center-block img-circle" style="height: 64px; max-width: 64px;" src="{$vo.thumb}" /></a>
								</div>
								<div class="col-xs-8 no-padding no-margin">
									<h4 class="more"><a href="{:addon_url('leescore/goods/details',array('gid' => $vo['id']))}">{$vo.name}</a></h4>
									<div class="text-area">
										<div class="col-xs-12 no-padding more text-muted">
											{:__('price')}: <span class="text-danger h3"> {$vo.scoreprice}</span> {:__('score')} + <span class="text-danger h3">{$vo.money}</span> {:__('money')}
										</div>
									</div>
									<div class="clearfix btn-group margin-top pull-right">
										<a data-paramid="{$vo.id}" data-url="{:addon_url('leescore/cart/add')}" href="javascript:;" class="btn radius-none btn-default btn-xs {if($vo['stock'] < 1)}disabled{/if} add-cart"><span class="fa fa-cart-plus"></span> {:__('add cart')}</a> &nbsp;&nbsp;&nbsp;
										<a href="{:addon_url('leescore/goods/details',array('gid' => $vo['id']))}" class="btn btn-danger radius-none btn-xs {if($vo['stock'] < 1)}disabled{/if}">{:__('detail')}</a>
									</div>
									
								</div>
								<div class="clearfix"></div>
							</div>
						{/volist}
					</div>
					<!-- /.box-body -->
				</div>
			</div>
		</div>

		<div class="col-md-9">
			<form action="{:addon_url('leescore/order/createOrderOne')}" method="Post" name="buyPost" id="buyPost">
				<div class="goods-right" >
					<div class="clearfix padding-min" style="background-color:rgb(250, 250, 250) ;">
						<div class="col-md-5 thumb-view-area padding-none">
							<img src="{$item.thumb}" id="thumb-view" class="img-responsive img-thumbnail radius-none" width="100%" style="border: 1px solid #eee;" />
							<div class="box-detail-thumbs">
								<?php 
									$images = explode(",",$item['pics']);
								?>
								<div style="width: 90px; padding:5px 5px 0 0; float: left">
									<a href="javascript:;" class="thumbnail details-thumb thumb-active radius-none" style="margin-bottom: 7px;">
										<img src="{$item.thumb}" class="img-responsive details-thumb-img" width="100%" />
									</a>
								</div>
								{if($images[0] != '')}
									{volist name="$images" id="pic"}
										<div style="width: 90px; padding:5px 5px 0 0; float: left">
											<a href="javascript:;" class="thumbnail details-thumb radius-none" style="margin-bottom: 7px;">
												<img src="{$pic}" class="img-responsive details-thumb-img" width="100%" />
											</a>
										</div>
									{/volist}
								{/if}
							</div>
							<input type="hidden" name="id" value="{$item['id']}" />
						</div>
						<div class="col-md-7">

							<h2 class="">{$item.name}</h2>
							<div class="hidden-xs"><br /></div>

							<div class="text-muted">{:__('price')}：
								<span class="text-danger h2">{$item.scoreprice}</span> {:__('score')} + <span class="text-danger h2"> {$item['money']}</span> {:__('money')}
							</div>
							<h4 class="text-muted">{:__('order by stock')}：{$item.stock}</h4>
							<h4 class="text-muted">{:__('use num')}：{$item.usenum}</h4>
							{if condition="$item.stock gt 0"}								
								<div class="col-sm-5 padding-none">
									<div class="input-group">
										<span class="input-group-addon">{:__('buy num')}</span>
										<input type="Number" name="number" maxlength="9" min="1" value="1" class="form-control buynum">
									</div>
								</div>
								<div class="clearfix">
									<br>
									<br>
									<br>
									<br>
									<br>
								</div>
								<div class="col-sm-12 ">

									<div class="">
										<a data-paramid="{$item.id}" data-url="{:addon_url('leescore/cart/add')}" href="javascript:;" class="btn btn-warning add-cart btn-lg"><i class="fa fa-cart-plus"></i> {:__('add cart')}</a>

										<a href="javascript:;" class="btn btn-danger btn-lg buy_order" style="margin-left: 30px;">{:__('buy')}</a>
									</div>	
								</div>
							{else /}
								<div class="col-sm-5 padding-none">
									<div class="input-group disabled">
										<span class="input-group-addon">{:__('buy num')}</span>
										<input type="Number" maxlength="9" min="0" value="0" class="form-control">
									</div>
								</div>
								<div class="clearfix">
									<br>
									<br>
									<br>
									<br>
									<br>
								</div>
								<div class="col-sm-12 ">
									<a href="javascript:;" class="btn btn-danger btn-lg radius-none disabled pull-right">{:__('min stock')}</a>
								</div>
							{/if}
							<div class="clearfix"></div>
							<div class="text-right padding-small margin-top">
								数量： <span class="h2 text-danger" id="buynum"></span>
							</div>
							<div class="text-right padding-small">
								积分总计： <span class="h2 text-danger" id="score"></span> {:__('score')}
							</div>
							<div class="text-right padding-small">
								价格总计： <span class="h2 text-danger" id="money"></span> {:__('money')}
							</div>
						</div>
					</div>
					<br>
					<div class="detail-rule row clearfix margin-top">
						<!-- 切换卡：兑换规则、兑换说明 -->
						<div class="col-md-12">
				        	<!-- Custom Tabs -->
				        	<div class="nav-tabs-custom radius-none">
					            <ul class="nav nav-tabs">
					            	<li class="active"><a href="#desc" data-toggle="tab">{:__('product detail info')}</a></li>
					            	<li><a href="#rule" data-toggle="tab">{:__('goods rule')}</a></li>
					            </ul>
					            <div class="tab-content">
					            	<div class="tab-pane active" id="desc">
										<div class="padding">
											{$item.body}
										</div>
					            	</div>
					            	<!-- /.tab-pane -->
					            	<div class="tab-pane" id="rule">
										<div class="padding">
											{$item.rule}
										</div>
					            	</div>
					            	<!-- /.tab-pane -->
					            </div>
				            <!-- /.tab-content -->
				        	</div>
				        	<!-- nav-tabs-custom -->
						</div>
						<!-- ./ 切换卡：兑换规则、兑换说明 -->
					</div>
				</div>
			</form>
		</div>
	</div>
</div>
<!-- Layer -->
<script src="__CDN__/assets/libs/fastadmin-layer/dist/layer.js"></script>
<script>
	$(document).ready(function() {
		function count(number)
		{
			var score = '{$item["scoreprice"]}';
			var money = '{$item["money"]}';
			score = score * number;
			money = money * number;
			$("#score").html(score);
			$("#money").html(money)
			$("#buynum").html(number);
		}

		var number = $(".buynum").val();
		count(number);
		$(".buynum").on('change', function() {
			var num = $(this).val();
			count(num);
		});

		//限制数量框输入的内容必须为数字，如果不是数字就改成1
		$(".buynum").on('blur', function() {
			var val = $(this).val();
			if(val <= 0) $(".buynum").val(1);
		});

		//订单确认
		$('.buy_order').on('click', function() {
			$("#buyPost").submit();
		});

		$(".details-thumb").on('click', function() {
			var thisPath = $(this).children('img').attr("src");
			$(".details-thumb").removeClass('thumb-active');
			$(this).addClass('thumb-active');
			$("#thumb-view").attr('src', thisPath);
		});

		$("#buy_num").on('keyup', function() {
			if($(this).val() <= 0 ){
				$(this).val(1);
			}
		});

		$(".recommend-li").last().removeClass('recommend-li');
	});
</script>
